<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>快捷开店</title>
   <!--  <link rel="stylesheet" type="text/css" href="/admin/css/login.css" media="all"> -->
    <link rel="stylesheet" type="text/css" href="/admin/css/{{$config['COLOR_STYLE']}}.css" media="all">
    <link href="/admin/css/mui.min.css" rel="stylesheet" type="text/css"/>
    <link href="/admin/css/mui.picker.min.css" rel="stylesheet" type="text/css" />
    <link href="/admin/css/mui.poppicker.css" rel="stylesheet" type="text/css" />


</head>
<style type="text/css">
    .body_pad{
        padding: 1rem;
    }

    .check-tips{
        position: fixed;
        left: 30%;
        bottom: 5rem;
        font-size: 0.8rem;
        padding: 0.5rem 1rem;
        background: #777575;
        border-radius: 8px;
        color: #fff;
    }

    .form-item{

        display: flex;
        display: -webkit-flex;
        align-items: center;
        -webkit-align-items: center;

        padding: 0.5rem 0;
        border-bottom: 1px solid #eee;
    }
    .form-item label{
        width: 24%;
    }
    .form-item .controls{
        width: 74%;
    }
    .form-item input{
        border: none;
        width: 100%;
        height: 100%;
        outline: none;
        font-size: 1rem;
        margin-bottom: 0!important;
    }
    #submit{
        width: 100%;
        height: 3.3rem;
        position: fixed;
        bottom: 0;
        left: 0;
        font-size: 1.2rem;
        border: none;
        background: rgba(253, 61, 0, 0.9);
        color: #fff;
    }

    .border_active{
        border-bottom: 1px solid rgba(253, 61, 0, 0.9);
    }
</style>
<body id="login-page" style="background:#fff;background-color:fff">
<div id="main-content">
    <!-- 主体 -->
    <div class="login-body">
        <div class="body_pad">
            <div class="login-main pr">
                <form action="{{urlAccount('simple','getSimple')}}" method="post"  id='myform'>
                        <!-- 基础 -->
                    <div id="tab1" class="tab-pane in tab1">
                        <div class="form-item border_active">
                            <label class="item-label">
                                店铺名称<!-- <span class="check-tips">（名称不能为空）</span> -->
                            </label>
                            <div class="controls">
                                <input type="text" name="shop_name" class="text input-large shop_name" placeholder="请输入店铺名称" value="">
                            </div>
                        </div>
                    
                        <div class="form-item">
                            <label class="item-label">
                                店铺账号<!-- <span class="check-tips">（请输入店铺账号）</span> -->
                            </label>
                            <div class="controls">
                                <input type="text" name="account_name" class="text input-large" placeholder="请输入店铺账号" value="">
                            </div>
                        </div>
                        
                        <div class="form-item">
                            <label class="item-label">
                                所属区域<!-- <span class="check-tips"></span> -->
                            </label>
                            <div class="controls">
                                <input style="text-align: left;" name="area_info" class='mui-btn mui-btn-block edit-right area_info' placeholder="请选择店铺所在区域"  type="text"  value="北京市 市辖区  东城区"  id='showCityPicker3'/>
                                <!-- <div id="area">
                                    <select name="province"></select>
                                    <select name="city"></select>
                                    <select name="area"></select>
                                </div>
                                <input type="hidden" name="area_info" id="area_info" placeholder="请选择店铺所在区域" 
                                       value=""> -->
                            </div>
                        </div>
                        <div class="form-item">
                            <label class="item-label">
                                详细地址<!-- <span class="check-tips">（地址不能为空）</span> -->
                            </label>
                            <div class="controls">
                                <input type="text" name="address" class="text input-large" style="width: 550px;"
                                       placeholder="请填写店铺详细地址"
                                       value="">
                            </div>
                        </div>
                        <div class="form-item">
                            <label class="item-label">
                                联系人<!-- <span class="check-tips">（经营者姓名不能为空）</span> -->
                            </label>
                            <div class="controls">
                                <input type="text" name="boss_name" class="text input-large" placeholder="请输入经营者姓名" 
                                       value="">
                            </div>
                        </div>
                        <div class="form-item">
                            <label class="item-label">
                                联系方式<!-- <span class="check-tips">（请输入手机号）</span> -->
                            </label>
                            <div class="controls">
                                <input type="text" name="shop_phone" class="text input-large" placeholder="请输入联系方式" 
                                       value="">
                            </div>
                        </div>
                        <button type="submit" id="submit" class="ajax-post" target-form="form-horizontal">确 定 </button>
                        <div class="check-tips" style="display:none"></div>
                            
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script src="/static/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="/admin/js/mui.min.js"></script>
<script type="text/javascript" src="/admin/js/mui.picker.js"></script>
<script type="text/javascript" src="/admin/js/mui.poppicker.js"></script>
<script src="/admin/js/city.data-3.js" type="text/javascript" charset="utf-8"></script>

<!--<![endif]-->
<script type="text/javascript">
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

   /* $(function () {
        $('#area').citys({
            required: false,
            nodata: 'disabled',
            onChange: function (data) {
                $('#area_info').val(data['province'] + ' ' + data['city'] + ' ' + data['area']);
            }
        });
        $("input[name=reply]").change(function () {
            var $reply = $(".form-item.reply");
            parseInt(this.value) ? $reply.show() : $reply.hide();
        }).filter(":checked").change();
    });*/


    
    console.log(cityData3)
       

    var _getParam = function (obj, param) {
        console.log(obj[param])
        return obj[param] || '';
    };
    var cityPicker3 = new mui.PopPicker({
        layer: 3
    });
    cityPicker3.setData(cityData3);
    cityPicker3.pickers[0].setSelectedIndex(0);
    cityPicker3.pickers[0].setSelectedValue('110000');
    cityPicker3.pickers[1].setSelectedIndex(0);
    cityPicker3.pickers[1].setSelectedValue('110000');
    cityPicker3.pickers[2].setSelectedIndex(0);
    cityPicker3.pickers[2].setSelectedValue('110101');
    var showCityPickerButton = document.getElementById('showCityPicker3');
    //监听重选地址
    showCityPickerButton.addEventListener('tap', function (event) {
        cityPicker3.show(function (items) {
            showCityPickerButton.value = _getParam(items[0], 'text') + " " + _getParam(items[1], 'text') + " " + _getParam(items[2], 'text');
            $("#province_id").val(_getParam(items[0], 'value'));
            $("#city_id").val(_getParam(items[1], 'value'));
            $("#area_id").val(_getParam(items[2], 'value'));
            
        });
    }, false);
    
    $(document)
        .ajaxStart(function(){
        
           /* $("button:submit").addClass("log-in").attr("disabled", true);*/
            //判断各项是否填写
        
           
        })
        .ajaxStop(function(){
           /* $("button:submit").removeClass("log-in").attr("disabled", false);*/
        });
    $("form").submit(function(){
        
            var self = $(this);
            var shop_name = $('.shop_name').val();
            if(shop_name == undefined || shop_name == null || shop_name == ''){
                $('.check-tips').show();
                $(".check-tips").text("错误啦");
                setTimeout(function () {
                    $('.check-tips').hide();
                },2000);
                return;
            }
            console.log(self.attr("action"));
            $.post(self.attr("action"), self.serialize(), success, "json");
            return false;

            function success(data){
                if(data.status){
                    /*window.location.href = data.url;*/
                    console.log(data)
                } else {
                    $('.check-tips').show();
                    self.find(".check-tips").text(data.info);
                    setTimeout(function () {
                        $('.check-tips').hide();
                    },2000)
                
                }
            }
        });


</script>

</body>
</html>
